<template>
	<view class="Global">
			<!-- <image class="imagepage" src="/static/background@2x.png" mode=""></image> -->
			<bgImage></bgImage>
		<MyNav :title="title" bgColor="" :backIcon="isback"></MyNav>





		<view class="Content">

			<view class="contentInner">

				<view class="contentInnerItem">

					<view class="baseListItem">
						<text class="baseListItemText">数量</text>
						<input class="baseListItemInput" type="text" v-model="itemData.quantity" />
					</view>
					<view class="line"></view>
        </view>

        <view class="contentInnerItem">
          <view class="baseListItem">
            <text class="baseListItemText">尺码</text>
            <input class="baseListItemInput" type="text" v-model="itemData.sizes" />
          </view>
          <view class="line"></view>
        </view>

        <view class="contentInnerItem">
          <view class="baseListItem">
            <text class="baseListItemText">颜色</text>
            <input class="baseListItemInput" type="text" v-model="itemData.colors" />
          </view>
          <view class="line"></view>
        </view>


        <view class="contentInnerItem">
          <view class="baseListItem">
            <text class="baseListItemText">床号</text>
            <input class="baseListItemInput" type="text" v-model="itemData.batchs" />
          </view>
          <view class="line"></view>
        </view>

        <view class="contentInnerItem">
          <view class="baseListItem">
            <text class="baseListItemText">损耗</text>
            <input class="baseListItemInput" type="text" v-model="itemData.lossQty" />
          </view>


				</view>

			</view>
		</view>




		<view class="ContentTips">
			<text class="ContentTipsText">注意：可登记的最大数,为扎数量减去损耗量</text>
		</view>



		<view class="loginContent">

			<button style="color:#ffffff" class="login" type="default" @click="updateSplittingUpData">{{login}}</button>
		</view>


	</view>
</template>

<script>
	import MyNav from '@/components/customnavbar.vue'
	import bgImage from '@/components/backgroundImage.vue'
  import {updateSplittingUp} from "../../../pages/api/api";

	export default {
		components: {
			MyNav,
			bgImage
		},
		data() {
			return {

				login: '确定',

				title: '编辑',
				isback: true,

        itemData: {},
				sizeListData: [{
						title: '数量',
						value: '100'
					},
					{
						title: '尺码',
						value: 'S'
					}, {
						title: '颜色',
						value: '黑'
					}, {
						title: '床号',
						value: '100'
					}, {
						title: '损耗',
						value: '100'
					}
				],

			}
		},
    onLoad: function (option) {
      let item = JSON.parse(decodeURIComponent(option.item));
      console.log('cuttingOrderEdit',item)
      this.itemData = item.item
    },
		methods: {
      updateSplittingUpData(){
        console.log('this.itemData',this.itemData)
        updateSplittingUp(this.itemData).then(res=>{
          if(res.code==200){
            // 显示提示信息
            uni.showToast({
              title: res.msg,
              icon: 'none'
            });
          }
        }).catch((err) => {
          console.log('编辑失败', err);
        });
      }
		}
	}
</script>

<style>

	.imagepage {

		background-size: cover;
		background-repeat: no-repeat;
		background-position: center center;
		position: absolute;
		z-index: -1;
		left: 0;
		right: 0;
		bottom: 0;
		right: 0;
		width: 100%;
		height: 100%;

	}
	.loginContent {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		width: 750rpx;


	}

	.login {
		display: flex;
		justify-content: center;
		margin-top: 40rpx;
		align-items: center;
		text-align: center;


		font-family: HarmonyOS Sans SC;
		font-weight: 400;
		font-size: 28rpx;
		color: #FFFFFF;
		line-height: 30rpx;

		width: 690rpx;
		height: 100rpx;
		background: linear-gradient(90deg, #45A8FF, #0AE1C6);
		border-radius: 20rpx;




	}

	.ContentTipsText {

		width: 479rpx;
		height: 25rpx;
		font-family: HarmonyOS Sans SC;
		font-weight: 400;
		font-size: 24rpx;
		color: #FF4E00;
		line-height: 80rpx;

		display: flex;
		justify-content: center;
		align-items: center;
	}


	.ContentTips {
		display: flex;
		justify-content: center;
		align-items: center;
		margin-top: 30rpx;
	}




	.baseListItemInput {
		width: 100rpx;

		font-size: 24rpx;
		color: #333333;
		font-weight: 600;
		display: flex;
		justify-content: right;
		align-items: center;
		text-align: right;
		margin-right: 30rpx;
	}

	.baseListItemText {

		font-size: 24rpx;
		color: #333333;
		line-height: 100rpx;
		text-align: center;
		font-style: normal;
		text-transform: none;
		font-weight: 600;
		display: flex;
		justify-content: center;
		align-items: center;
		margin-left: 30rpx;
	}

	.line {
		width: 100%;
		height: 1rpx;
		background: #EEEEEE;
		/* background: #EEEEEE; */
	}

	.baseListItem {
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		height: 120rpx;
		width: 100%;



	}

	.baseList {
		display: flex;
		flex-direction: column;
		width: 100%;
		flex-wrap: wrap;

	}


	.contentInnerItem {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		align-items: center;
		width: 100%;
		height: 120rpx;
	}

	.contentInner {
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
		width: 100%;


	}

	.Content {

		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;

		width: 690rpx;
		height: 600rpx;
		background: #FFFFFF;

		border-radius: 30rpx;
		margin-top: 30rpx;
	}
</style>
